<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>裤子</title>
    <!-- <link rel="stylesheet" href="../css/reset.css"> -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.2/lib/index.css">
    <link rel="stylesheet" href="../css/clothes.css">
</head>
<body>
    <script src="../js/vue.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vant@2.2/lib/vant.min.js"></script>
    <div id="container">
        <!--返回框 start-->
        <div class="back">
            <!-- left-arrow显示左侧箭头，fixed固定在顶部 -->
            <van-nav-bar title="裤子" left-text="返回" left-arrow fixed v-on:click-left='onClickLeft'>
                <van-icon name="search" slot="right" />
            </van-nav-bar>
        </div>
        <!--返回框 end-->

        <!--pants列表 start-->
        <div class="list">
            <ul>
                <li>
                    <img src="https://gd2.alicdn.com/imgextra/i3/0/O1CN01W4jPGj2CHEWVP45Y3_!!0-item_pic.jpg" alt="">
                    <div class="describe">
                        <p class="title">MG小象高腰西装裤子女2019新款韩版学生秋季宽松bf显瘦直筒休闲裤</p>
                        <p class="price"><span>¥<em>138</em></span>&nbsp;&nbsp;已售324件</p>
                    </div>
                </li>
            </ul>
            <ul>
                <li>
                    <img src="https://gd1.alicdn.com/imgextra/i2/0/O1CN01Jiyol32CHEWcXKCcY_!!0-item_pic.jpg" alt="">
                    <div class="describe">
                        <p class="title">MG小象直筒休闲裤女2019新款秋季高腰韩版宽松时尚显瘦薄款裤子潮</p>
                        <p class="price"><span>¥<em>138</em></span>&nbsp;&nbsp;已售543件</p>
                    </div>
                </li>
            </ul>
            <ul>
                <li>
                    <img src="https://img.alicdn.com/imgextra/i2/163429016/O1CN01eLatcV2GTNPAnyKTZ_!!163429016.jpg" alt="">
                    <div class="describe">
                        <p class="title">韩版秋冬毛呢阔腿裤女九分裤直筒宽松百搭高腰呢子休闲宽腿阔脚裤</p>
                        <p class="price"><span>¥<em>198</em></span>&nbsp;&nbsp;已售1034件</p>
                    </div>
                </li>
            </ul>
            <ul>
                <li>
                    <img src="https://gd3.alicdn.com/imgextra/i3/134363478/TB2PoGFeyOYBuNjSsD4XXbSkFXa_!!134363478.jpg" alt="">
                    <div class="describe">
                        <p class="title">美特斯邦威官方网店2019秋季新款铅笔裤九分裤韩版女牛仔裤756671</p>
                        <p class="price"><span>¥<em>169</em></span>&nbsp;&nbsp;已售234件</p>
                    </div>
                </li>
            </ul>
            <ul>
                <li>
                    <img src="https://gd1.alicdn.com/imgextra/i3/4132288022/O1CN01fN4wyb2987mks0IiK_!!4132288022.jpg" alt="">
                    <div class="describe">
                        <p class="title">秋冬黑色牛仔裤膝盖一字破洞裤</p>
                        <p class="price"><span>¥<em>100</em></span>&nbsp;&nbsp;已售542件</p>
                    </div>
                </li>
            </ul>
            <ul>
                <li>
                    <img src="https://gd1.alicdn.com/imgextra/i1/2498512100/O1CN0189FI2F1RNqJg4NYQ1_!!2498512100.jpg" alt="">
                    <div class="describe">
                        <p class="title">2019秋冬新款浅色卷边牛仔裤高腰显瘦宽松百搭阔腿裤女网红九分裤</p>
                        <p class="price"><span>¥<em>80</em></span>&nbsp;&nbsp;已售873件</p>
                    </div>
                </li>
            </ul>
        </div>
        <!--pants列表 end-->
        <!--列表底部 start-->
        <div>
            
        </div>
        <!--列表底部 end-->
    </div>
    <script>
        var vm = new Vue({
            el: "#container",
            methods: {
                onClickLeft:function(){
                    window.location.href='../html/home.html'
                }
            },
        })
    </script>
</body>
</html>